<template>
  <div class="AfterloginhomePage">

    <!--    <el-button>{{ msg }}</el-button>-->
    <!--    <img alt="Vue logo" src="../assets/logo.png">-->
    <el-row style="margin-top: 15px">
      <el-col :span="12">
        <div class="grid-content bg-purple">
          <h1 style="margin-right: 300px">分布式供应链管理与验证平台</h1>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="grid-content bg-purple-light">
          <el-row>
            <el-col :span="12">
              <div class="grid-content bg-purple">
                <el-avatar style="margin-left: 600px; margin-top: 20px; margin-bottom: 10px;"> user </el-avatar>
              </div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple">
                <h5 style="margin-right: 250px; margin-top: 30px;">已登录</h5>
              </div>
            </el-col>
          </el-row>

        </div>
      </el-col>

    </el-row>
    <IndexSwiper style="margin-top: 10px"/>
    <el-skeleton :rows="1" animated />

    <el-steps :active="4" align-center style="margin-top: 25px">
      <el-step title=" " description=" ">
      </el-step>
      <el-step title=" " description=" "></el-step>
      <el-step title=" " description=" "></el-step>
      <el-step title=" " description=" "></el-step>
    </el-steps>
    <el-row style="margin-top: 15px">
      <el-col :span="6"><div class="grid-content bg-purple">
        <el-button type="primary" style="font-size: x-large" @click="gostage1()">知识图谱</el-button></div>
      </el-col>
      <el-col :span="6"><div class="grid-content bg-purple-light">
        <el-button type="primary" style="font-size: x-large" @click="gostage2()">供应链变更效应传播仿真系统</el-button></div>
      </el-col>
      <el-col :span="6"><div class="grid-content bg-purple">
        <el-button type="primary" style="font-size: x-large" @click="gostage3()">供应链变更辅助决策支持系统</el-button></div>
      </el-col>
      <el-col :span="6"><div class="grid-content bg-purple-light">
        <el-button type="primary" style="font-size: x-large" @click="gostage4()">供应链变更效应传播可视化系统</el-button></div>
        </el-col>
    </el-row>

    <!--    <el-steps :active="1" finish-status="success" simple style="margin-top: 20px">-->
    <!--      <el-step title="知识图片构建" ></el-step>-->
    <!--      <el-step title="分析仿真模块" ></el-step>-->
    <!--      <el-step title="辅助决策支持" ></el-step>-->
    <!--      <el-step title="供应管理可视化" ></el-step>-->
    <!--    </el-steps>-->
    <!--    <HelloWorld msg="Welcome to Your Vue.js App"/>-->
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import IndexSwiper from "@/components/index/IndexSwiper";


export default {
  name: 'AfterloginhomePage',
  data() {
    return {
      msg: "沈艺珊的elmentui导入测试"
    }

  },
  methods: {
    gostage1() {
      this.$router.push({
        path: "/BackstagemanagePage",
        query: {
          username: this.$route.query.username
        }
      })
    },
    gostage2() {
      this.$router.push({
        path: "/Backstage2managePage",
        query: {
          username: this.$route.query.username
        }
      })
    },
    gostage3() {
      this.$router.push({
        path: "/Backstage3managePage",
        query: {
          username: this.$route.query.username
        }
      })
    },
    gostage4() {
      this.$router.push({
        path: "/Backstage4managePage",
        query: {
          username: this.$route.query.username
        }
      })
    },
  },

  components: {
    IndexSwiper,
    HelloWorld,
  }
}
</script>
